<template>
    <div class="vprops-son">
        <el-button @click="tip">点击按钮获取父组件传过来的值</el-button>
    </div>
</template>

<script>
export default {
    name: 'VpropsSunComp',
    // 接收父组件传递过来的值 
    // 简单接收方式：
    // props: ['val'],

    // 带有高级配置项的接收方式：
    props: {
        // 只检测接收的数据类型：
        // val: String,

        // 完整配置：
        val: {
            type: String, // val的数据类型
            defalut: '', // 默认值。一般和required不同时使用
            required: true, // 设置为true，表示val必须有值。默认为false。一般和default不同时使用。
            validator: function(val) { // 自定义函数。把父组件传过来的值作为参数，返回一个经过处理的值。
                return val.toString();
            }
        }
    },
    methods: {
        tip() {
            alert('从父组件传递过来的值是：' + this.val)
        }
    }
}
</script>

<style lang="less" scoped>
.vprops-son {
    margin-top: 10px;
}
</style>